<script setup>

import TagDisplay from "@/components/Asset/TagDisplay.vue";
import Constants from './constants.js'

const props = defineProps({
  codePosition: {
    type: String,
    required: true,
  },
  fields: {
    type: String,
    required: true
  },
  labelType: {
    type: String,
    required: true
  }
});

const content = computed(()=> {
  if (!props.fields) {
    return [];
  }
  const fieldListAll = Constants.fieldListAll;
  return props.fields.split(',').map(item=> {
    const findField = fieldListAll.find(field=> {
      return field.value === item;
    });
    let label = null;
    if (findField) {
      label = findField.label;
    }
    return {
      name: label,
      value: 'XXXXX'
    }

  })

});

</script>

<template>
  <div>
    <tag-display :label-type="labelType" style="width: 300px;" :content="content" :code-position="codePosition" code="barcode"></tag-display>
  </div>

</template>

<style scoped lang="scss">

</style>